<template>
  <a-card class="card" :loading="departCardloading" :bordered="false">
    <div class="tree-operations">
      <a-directory-tree
        :loadData="onLoadData"
        :treeData="departsData"
        :selectedKeys="selectedKeys"
        @select="onSelect"
      >
      </a-directory-tree>
    </div>
  </a-card>
</template>

<script>
import { getDepartByParentDepartPid } from '../org/department/depart'
import storage from 'store'

export default {
  name: 'DepartTreeSelect',
  components: {
  },
  props: {
  },
  data () {
    return {
      departsData: [{ title: storage.get('orgName'), key: storage.get('org') }],
      departCardloading: false,
      selectedKeys: []
    }
  },
  beforeCreate () {
  },
  created () {
    this.getTopDepartment()
  },
  mounted () {
  },
  methods: {
    // 部门树加载节点
    onLoadData (treeNode) {
      console.log(treeNode)
      return new Promise(resolve => {
        if (treeNode.dataRef.children) {
          resolve()
          return
        }
        getDepartByParentDepartPid(treeNode.dataRef.key, {})
          .then(res => {
            if (res) {
              if (res.code !== 'C0') {
                treeNode.dataRef.children = []
                var departments = res.data
                for (var i = 0; i < departments.length; i++) {
                  var tn = {
                    title: departments[i].departName,
                    key: departments[i].pid
                  }
                  treeNode.dataRef.children.push(tn)
                }
                this.departsData = [...this.departsData]
              }
            }
          })
        resolve()
      })
    },
    // 节点加载
    onSelect (selectedKeys, info) {
      this.personCardloading = true
      // 加载子节点
      const treeNode = info.node
      getDepartByParentDepartPid(treeNode.dataRef.key, {})
        .then(res => {
          if (res) {
            if (res.code !== 'C0') {
              treeNode.dataRef.children = []
              var departments = res.data
              for (var i = 0; i < departments.length; i++) {
                var tn = {
                  title: departments[i].departName,
                  key: departments[i].pid
                }
                treeNode.dataRef.children.push(tn)
              }
              this.departsData = [...this.departsData]
            }
          }
        })
      // 结束
      this.selectedNodes = [info] // 节点单选
      if (this.selectedKeys !== [selectedKeys[0]]) {
        this.selectedKeys = [selectedKeys[0]] // 节点单选
      }
      this.$emit('selectedDeparts', this.selectedKeys[0])
    },
    // 初始顶级部门
    getTopDepartment () {
      this.departsData = []
      new Promise((resolve) => {
        resolve(getDepartByParentDepartPid('org', {}))
      }).then(res => {
        new Promise((resolve) => {
          console.log(res)
          if (res.code === 'C1') {
            var departments = res.data
            for (var i = 0; i < departments.length; i++) {
              if (i === 0) {
                this.selectedKeys = [departments[i].pid]
              }
              var tn = {
                title: departments[i].departName,
                key: departments[i].pid
              }
              if (this.departsData.children) {
                this.departsData.children.push(tn)
              } else {
                this.departsData.push(tn)
              }
              console.log('departsData', this.departsData)
            }
            // if (this.treeData) {
            //   this.treeData.selectedKeys = { [0] }
            // }
          }
          this.departCardloading = false
          resolve()
          // })
        }).then(() => {
          if (this.selectedKeys) {
          }
        })
      }).catch(() => {
        // Do something
      }).finally(() => {
      })
    }
  },
  watch: {
    // selectedKeys: function () {
    //   this.selectedKeys = ' this.selectedKeys'
    // }
  }
}
</script>

<style lang="less">
@import '~ant-design-vue/lib/style/themes/default.less';
</style>
